<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-style-type" content="text/css">
<title>Other enhancements</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1252">
<meta name="generator" content="RoboHelp by eHelp Corporation www.ehelp.com">
<link rel="stylesheet" href="interakt_new_ns.css" type="text/css">
<script type="text/javascript" language="JavaScript">
<!--
if (navigator.appName !="Netscape")
{   document.write("<link rel='stylesheet' href='interakt_new.css'>");}
//-->
</script>
<style type="text/css">
<!--
div.whs1 { width:100%; }
p.whs2 { text-align:right; }
img_whs3 { border:none; width:40px; height:50px; float:none; }
table.whs4 { width:100%; }
td.whs5 {  }
hr.whs6 { float:aligncenter; }
ol.whs7 { list-style:decimal; }
img_whs8 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:503px; height:41px; float:none; }
img_whs9 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:256px; height:380px; float:none; }
img_whs10 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:474px; height:57px; float:none; }
img_whs11 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:301px; height:111px; float:none; }
img_whs12 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:738px; height:475px; float:none; }
img_whs13 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:663px; height:525px; float:none; }
img_whs14 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:640px; height:123px; float:none; }
img_whs15 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:260px; height:350px; float:none; }
img_whs16 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:502px; height:151px; float:none; }
img_whs17 { border-left-style:Solid; border-left-width:1px; border-right-style:Solid; border-right-width:1px; border-top-style:Solid; border-top-width:1px; border-bottom-style:Solid; border-bottom-width:1px; width:407px; height:191px; float:none; }
-->
</style>

<script type="text/javascript" language="JavaScript">
<!--
function reDo() {
  if (innerWidth != origWidth || innerHeight != origHeight)
     location.reload();
}
if ((parseInt(navigator.appVersion) == 4) && (navigator.appName == "Netscape")) {
        origWidth = innerWidth;
        origHeight = innerHeight;
        onresize = reDo;
}
onerror = null; 
//-->
</script>
<style type="text/css">
<!--
div.WebHelpPopupMenu { position:absolute; left:0px; top:0px; z-index:4; visibility:hidden; }
-->
</style>

<script type="text/javascript" language="javascript1.2" src="whtopic.js">
</script>
<script type="text/javascript" language="javascript1.2" src="whutils.js">
</script>
<script type="text/javascript" language="javascript" src="whver.js">
</script>
<script type="text/javascript" language="javascript1.2">
<!--
    var linkedScrollbarStyle = "<link rel='stylesheet' href='wf_topics.css'>";
    if( (!isTopicOnly()) &&(parent.gbFHPureHtml == null) )
    {
        document.write(linkedScrollbarStyle);
    }
    //-->
</script>
</head>
<body>
<script type="text/javascript" language="javascript1.2">
<!--
if (window.addTocInfo)
{
addTocInfo("Using JSEclipse\nOther enhancements");
addAvenueInfo("Using JSEclipse","3300_jserrordebug.htm","4000_otherres.htm");

  addShowButton();
}
if (window.setRelStartPage)
{
setRelStartPage("jseclipse.htm");

        sendTopicLoaded();
        autoSync(1);
        sendSyncInfo();
        sendAveInfo();
        sendBgColorInfo();
}
//-->
</script>
<div id="header" class="whs1">
<p align="right" class="whs2"><img src="images/adobe_logo.png" width="40px" height="50px" border="0" class="img_whs3" alt=""></p>
<table width="100%" class="whs4">
<tr>
<td colspan="3" valign="top" class="whs5">&#160;<br>
&#160;<br>
<hr class="whs6"></td>
</tr>
</table>
</div>
<h1>Other enhancements</h1>
<p>Aside the major code completion, navigation and error reporting enhancements brought forth for the <span class="Labels">JavaScript</span> developers, <span class="Labels">JSEclipse</span> also comes with some smaller, but very useful options:</p>
<ol type="1" class="whs7">
<li class="kadov-p">
<p><a href="#codewrap">Code wrap to the editor's window</a></p>
</li>
<li class="kadov-p">
<p><a href="#refreshcode">Refreshing code completion</a></p>
</li>
<li class="kadov-p">
<p><a href="#jsreference">JavaScript Reference</a></p>
</li>
<li class="kadov-p">
<p><a href="#templates">Code templates</a></p>
</li>
<li class="kadov-p">
<p><a href="#edithtml">Easily edit JavaScript code embedded in HTML files.</a></p>
</li>
</ol>
<h3>Code wrap<a name="codewrap"></a></h3>
<p>One of the smaller enhancements brought by <span class="Labels">JSEclipse</span> for the <span class="Labels">JavaScript</span> developers is to allow code wrap in the <span class="Labels">Eclipse</span> workbench editor window. This helps when writing long lines of code that extend beyond the visible editor surface, making the code easier to read. For example, a long variable definition can be made much more clear:<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/long_variable_definition.png' x-maintain-ratio='TRUE' width='503px' height='41px' border='1' class='img_whs8'>");}
else
{   document.write("<img src='images/long_variable_definition.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='503px' height='41px' border='1' class='img_whs8'>");}
//-->
</script><br>
&#160;</p>
<p>To enable code wrapping to window, select the <span class="Labels">Edit</span> menu <span class="Labels">&gt; Word wrap</span> option:<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/word_wrap_enable.png' x-maintain-ratio='TRUE' width='256px' height='380px' border='1' class='img_whs9'>");}
else
{   document.write("<img src='images/word_wrap_enable.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='256px' height='380px' border='1' class='img_whs9'>");}
//-->
</script><br>
&#160;</p>
<p>Now, the variable definition is shown entirely in the editor:<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/short_variable_definition.png' x-maintain-ratio='TRUE' width='474px' height='57px' border='1' class='img_whs10'>");}
else
{   document.write("<img src='images/short_variable_definition.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='474px' height='57px' border='1' class='img_whs10'>");}
//-->
</script></p>
<p>&#160;</p>
<h3>Refresh code completion library<a name="refreshcode"></a></h3>
<p>When the code completion feature does not display the latest functions or variables added to the project, its library might need refreshing. This determines a new parse of all <span class="Labels">*.js</span> files in the current project, refreshing the list of class methods, functions and variable names. To access the refresh command, select the <span class="Labels">JSEclipse</span> menu option, and then the <span class="Labels">Refresh code completion library</span>:<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/refresh_completion_menu_3v2.png' x-maintain-ratio='TRUE' width='301px' height='111px' border='1' class='img_whs11'>");}
else
{   document.write("<img src='images/refresh_completion_menu_3v2.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='301px' height='111px' border='1' class='img_whs11'>");}
//-->
</script></p>
<p>&#160;</p>
<h3>JavaScript Reference<a name="jsreference"></a></h3>
<p><span class="Labels">JSEclipse</span> has embedded the basic <span class="Labels">JavaScript</span> function reference into the plugin, so now when you are in a hurry to develop and need to take a peek at one function, you can open it directly in <span class="Labels">Eclipse</span>.</p>
<p>The Reference library can be accessed in two ways:</p>
<ol type="1" class="whs7">
<li class="kadov-p">
<p>From the J<span class="UserInput">SEclipse menu &gt; Reference library</span></p>
</li>
<li class="kadov-p">
<p>By pressing the <span class="UserInput">F1</span> key.</p>
</li>
</ol>
<p>When accessed, the reference will open just like another <span class="Labels">Eclipse</span> HTML document, in the workbench with the main index:<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/reference_lib.png' x-maintain-ratio='TRUE' width='738px' height='475px' border='1' class='img_whs12'>");}
else
{   document.write("<img src='images/reference_lib.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='738px' height='475px' border='1' class='img_whs12'>");}
//-->
</script></p>
<p>&#160;</p>
<h3><a name="templates"></a>Code templates</h3>
<p><span class="UserInput">JSEclipse</span> allows you to define and use templates for the bits of code that you use most often. To view existing templates, edit or add one, go to <span class="Labels">Window &gt; Preferences &gt; JSEclipse &gt; Templates</span>.</p>
<p>&#160;</p>
<p><script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/template_window.png' x-maintain-ratio='TRUE' width='663px' height='525px' border='1' class='img_whs13'>");}
else
{   document.write("<img src='images/template_window.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='663px' height='525px' border='1' class='img_whs13'>");}
//-->
</script></p>
<p>&#160;</p>
<p>To apply a template, start typing the first letters of the name, and from the code completion dialog select the entry marked as a template:</p>
<p>&#160;</p>
<p><script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/apply_template.png' x-maintain-ratio='TRUE' width='640px' height='123px' border='1' class='img_whs14'>");}
else
{   document.write("<img src='images/apply_template.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='640px' height='123px' border='1' class='img_whs14'>");}
//-->
</script></p>
<p>&#160;</p>
<p>&#160;</p>
<h3><a name="edithtml"></a>Easily edit JavaScript code embedded in HTML files</h3>
<p>&#160;</p>
<p>When you have JavaScript code in your HTML files, it is somewhat cumbersome to edit using the simple text editor. You could copy the code into a separate .js file and edit it using JSEclipse, and then copy the changes back. But with <span style="font-weight:bold;"><b>JSEclipse</b></span> there is an easier way to do it:</p>
<ol type="1" class="whs7">
<li class="kadov-p">
<p>Open your HTML file containing JavaScript code with the simple text editor in <span style="font-weight:bold;"><b>Eclipse</b></span>.</p>
</li>
<li class="kadov-p">
<p>Right-click within the code block in between the <span class="Code">&lt;script&gt;</span> tags. From the menu select the Edit in <span style="font-weight:bold;"><b>JSEclipse</b></span> option:<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/edit_in_jseclipse.png' x-maintain-ratio='TRUE' width='260px' height='350px' border='1' class='img_whs15'>");}
else
{   document.write("<img src='images/edit_in_jseclipse.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='260px' height='350px' border='1' class='img_whs15'>");}
//-->
</script><br>
&#160;</p>
</li>
<li class="kadov-p">
<p>A new temporary file will be created, containing only the <span style="font-weight:bold;"><b>JavaScript</b></span> code. You can edit the file and add the desired changes.<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/temp_jsfile.png' x-maintain-ratio='TRUE' width='502px' height='151px' border='1' class='img_whs16'>");}
else
{   document.write("<img src='images/temp_jsfile.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='502px' height='151px' border='1' class='img_whs16'>");}
//-->
</script><br>
&#160;</p>
</li>
<li class="kadov-p">
<p>Save your changes. They will be automatically copied into the original HTML file as well.<br>
<br>
<script type="text/javascript" language="JavaScript">
<!--
if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) <= 4)) 
{  if (parseInt(navigator.appVersion) != 2) document.write("<img src='images/changes_in_html.png' x-maintain-ratio='TRUE' width='407px' height='191px' border='1' class='img_whs17'>");}
else
{   document.write("<img src='images/changes_in_html.png' x-maintain-ratio='TRUE' style='border-left-style:Solid;border-left-width:1px;border-right-style:Solid;border-right-width:1px;border-top-style:Solid;border-top-width:1px;border-bottom-style:Solid;border-bottom-width:1px;' width='407px' height='191px' border='1' class='img_whs17'>");}
//-->
</script></p>
</li>
</ol>
<p>&#160;</p>
<div id="footer" class="whs1">
<table width="100%" class="whs4">
<tr>
<td colspan="3">
<hr class="whs6"></td>
</tr>
</table>
</div>
</body>
</html>
